<script setup lang='ts'>
import { ref } from 'vue'
const activeIndex = ref('1')
const activeIndex2 = ref('1')
const handleSelect = (key: string, keyPath: string[]) => {
  // console.log(key, keyPath)
}

</script>
<template>
<div  class="w-8/12 -ml-[200px] mt-1 ">
    
    <div class="flex justify-center items-center gap-3 -mr-10 mb-3">
        <img class=" w-[70px] h-[70px] object-cover rounded-full border-4 border-gray-400" src="https://www.houdunren.com/dist/images/boy.png" alt="">
        <el-button class="" type="info" size="small" round>关注他</el-button>
     </div>
    
<el-menu
    :default-active="activeIndex"
    class="!rounded-lg !bg-gray-300 flex
     justify-center items-center gap-9"
    mode="horizontal"
    @select="handleSelect"
    active-text-color="#e46cba"
  >


    <el-menu-item index="1">TA的帖子</el-menu-item>
   
      <el-menu-item index="2">TA的动态</el-menu-item>
      <el-menu-item index="3">TA的关注</el-menu-item>
    
      <el-menu-item index="4">TA的收藏</el-menu-item>
     
   
    
  </el-menu>
 
  <!-- <div class="flex justify-center items-center mr-10">
        <img class=" w-9 h-9 object-cover rounded-full" src="https://www.houdunren.com/dist/images/boy.png" alt="">
        <el-button class="" type="info" size="small" round>关注他</el-button>
     </div> -->
</div>
</template>
<style scoped lang='scss'>


</style>